<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
    <title>确认订单</title>
    <link rel="stylesheet" type="text/css" href="/css_z/base.css"/>
    <link rel="stylesheet" type="text/css" href="/css_z/confirm.css"/>
    <link rel="stylesheet" type="text/css" href="/css_z/mui.min.css"/>
    <link rel="stylesheet" type="text/css" href="/css_z/loaders.min.css"/>
    <link rel="stylesheet" type="text/css" href="/css_z/loading.css"/>
    <script src="/js_z/rem.js"></script>
    <script src="/js_z/jquery.min.js" type="text/javascript"></script>
	<script src="/js/plugins/jrender/jrender.min.js"></script>
	<link rel="stylesheet" href="/js/plugins/dialog2/dialog.css">
	<script src="/js/plugins/dialog2/dialog.min.js"></script>
	<script src="/js/common.js"></script>
	<script type="text/javascript">
		sessionStorage.url = "confirm";
		$(window).load(function(){
			$(".loading").addClass("loader-chanage")
			$(".loading").fadeOut(300)
		})

		$(function () {
            $.ajaxSettings.traditional=true;
            var params = getParams();
            var pids = []
            $.each(params,function (index,value) {
                pids.push(value)
            })
			var proudctDetail=[];
            var totalPrice = 0;
            var totalProductCount = 0;

            $.ajax({
                //async:同步
                async: false,
                url: '/users/productIds',
                data:{pids:pids},
                method: "get",
                success: function (data) {
                    console.log(data);
                    $.merge(proudctDetail,data)

                    //计算花费的总积分
                    $.each(proudctDetail,function (index, value) {
                        totalPrice+=value.number*value.productPrice;
                        totalProductCount+= value.number;
                    })
                    //设置总积分
                    $('#cost').html(totalPrice);
                    $('#totalProductCount').html(totalProductCount);
                    //设置总数
                    $('#productDetail').renderValues({list:data},{
                        getAddress:getAddress
                    });
                }
            });



            $("#saveOrder").click(function () {
                var orderDetail;//提交的订单信息
                var name = $('input[name="name"]').val();
                var address = $('input[name="address"]').val();
                var phone = $('input[name="phone"]').val();
                orderDetail={

                }
                console.log(proudctDetail);
                $.post('/users/payOrder', {  cost:$('#cost').html(),
                    name:name,
                    phone:phone,
                    address:address,pids:pids}, function (data) {
                    if(data.success){
                        $(document).dialog({
							autoClose:1000,
                            overlayClose: true,
                            content: '提交订单成功',
                        });
                        // 将购物车放进session
                        sessionStorage.setItem("shopCar",JSON.stringify(data.resultTwo));
                        window.location.href= '/mine/shop/zhifu.html?id='+data.result
					}
                })
            })
        });
	</script>
</head>
<!--loading页开始-->
<div class="loading">
    <div class="loader">
        <div class="loader-inner pacman">
            <div></div>
            <div></div>
            <div></div>
            <div></div>
            <div></div>
        </div>
    </div>
</div>
<!--loading页结束-->
	<body>
		<!--header star-->
		<header class="mui-bar mui-bar-nav" id="header">
			<a class="btn" href="javascript:history.go(-1)">
	            <i class="iconfont icon-fanhui"></i>
	        </a>
	        <div class="top-sch-box top-sch-boxtwo flex-col">
	                      确认订单
	        </div>
	    </header>
	    <!--header end-->
	    
	    <div class="warp warptwo clearfloat">
	    	<div class="confirm clearfloat" id="productDetail">
	    		<div class="add clearfloat box-s">
						<div class="gmshu gmshuthree clearfloat box-s fl">
							<div class="gcontent clearfloat">
								<p class="fl"> &nbsp;&nbsp;&nbsp;收货人：</p>
								<div class="you clearfloat fl">
									<input type="text" name="name" class="text" placeholder="请输入收货人姓名" />
								</div>
							</div>
							<div class="gcontent clearfloat">
								<p class="fl">联系电话：</p>
								<div class="you clearfloat fl">
									<input type="text" name="phone" class="text" placeholder="请输入收货人电话" />
								</div>
							</div>
							<div class="gcontent clearfloat">
								<p class="fl">收货地址：</p>
								<div class="you clearfloat fl">
									<input type="text" name="address" class="text" placeholder="请输入地址" />
								</div>
							</div>
						</div>
	    		</div>
				<div render-loop="list">
					<div class="lie clearfloat"><!--循环渲染商品信息-->
						<a data-href="detail.html?id=" render-key="list.productId" render-fun="getAddress">
						<div class="tu clearfloat fl">
								<img render-src="list.productPic"/>
							</div>
						</a>
						<div class="right clearfloat fl">
							<a data-href="detail.html?id=" render-key="list.productId" render-fun="getAddress">
								<p class="tit over" render-html="list.productName"></p>
							</a>
							<div class="xia clearfloat">
								<a data-href="detail.html?id=" render-key="list.productId" render-fun="getAddress">
									<p class="jifen fl over" render-html="list.productPrice"></p>
								</a>
								<span class="fr db" render-html="list.number"></span>
							</div>
						</div>
					</div>
				</div>
				<div class="gmshu clearfloat box-s fl">
					<div class="gcontent clearfloat">
						<p class="fl" >购买数量</p>
			     		<div class="you clearfloat fr">
			     			<ul>
			     				<li></li>
			     				<li></li>
			     				<li><span class="fr db" id="totalProductCount"></span></li>
			     			</ul>
			     		</div>
					</div>
		     	</div>
		     	<div class="gmshu gmshutwo clearfloat box-s fl">
					<div class="gcontent clearfloat">
						<p class="fl">配送方式</p>
			     		<div class="you clearfloat fr">
			     			<span>大后天到</span>
			     		</div>
					</div>
		     	</div>
		     	<div class="gmshu gmshutwo clearfloat box-s fl">
					<div class="gcontent clearfloat">
						<p class="fl">发票信息</p>
			     		<div class="you clearfloat fr">
			     			<div class="xuan clearfloat">
			     				<div class="radiotwo" >
								    <label>
								        <input type="radio" name="fapiao" value="" checked/>
								        <div class="option"></div>
								        <span class="opt-text">给你发票</span>
								    </label>
								</div>
			     			</div>
			     		</div>
					</div>
		     	</div>
		     	<div class="gmshu gmshuthree clearfloat box-s fl">
					<div class="gcontent clearfloat">
						<p class="fl">买家留言</p>
			     		<div class="you clearfloat fl">
			     			<input type="text" name="" id="" value="" class="text" placeholder="选填 对本次交易需求给商家留言" />
			     		</div>
					</div>
		     	</div>
	    	</div>
	    </div>

		<!--settlement star-->
	    <div class="settlement clearfloat">
	    	<div class="zuo clearfloat fl box-s">
	    		总积分：<span id="cost">100000</span>
	    	</div>
	    	<a href="#" class="fl db" id="saveOrder">
	    		提交订单
	    	</a>
	    </div>
	    <!--settlement end-->

		<!--footer star-->
	    <footer class="page-footer fixed-footer" id="footer">
			<ul>
				<li>
					<a href="index.html">
						<i class="iconfont icon-shouye"></i>
						<p>首页</p>
					</a>
				</li>
				<li>
					<a href="cation.html">
						<i class="iconfont icon-icon04"></i>
						<p>分类</p>
					</a>
				</li>
				<li class="active">
					<a href="shopcar.html">
						<i class="iconfont icon-gouwuche"></i>
						<p>购物车</p>
					</a>
				</li>
				<li>
					<a href="center.html">
						<i class="iconfont icon-yonghuming"></i>
						<p>我的</p>
					</a>
				</li>
			</ul>
		</footer>
		<!--footer end-->

	</body>
</html>
